
    <div class="layui-tab layui-tab-brief">
        <div  style="margin: 10px;">
            <div class="layui-form-item">
                <label>图示：&nbsp;&nbsp;&nbsp;&nbsp;</label>
                <span class="iconfont iconcheck" style="color:#428000;"></span>
                <label>：表示已经设置&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                <label>：表示未设置&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                <span class="iconfont iconminus "></span>
                <label>：表示没有该功能&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                <span class="iconfont iconceshishenqing"  ></span>
                <label>：表示可以对该功能设置</label>
            </div>
        </div>
        <table class="layui-table"  lay-filter="operatingList" id="operatingList" style="text-align: center;">
            <thead>
            <tr>
                <th style="width: 100px;text-align: center;" rowspan="2">序号</th>
                <th style="width: 100px;text-align: center;" rowspan="2">节点名</th>
                <th style="width: 200px;text-align: center;" rowspan="2" colspan="2">人员设置</th>
                <th style="width: 300px;text-align: center;"             colspan="5">流程事件</th>
                <th style="width: 200px;text-align: center;" rowspan="2" colspan="2">流程规则</th>
                <th style="width: 200px;text-align: center;" rowspan="2" colspan="2">表单设置</th>
                <th style="width: 200px;text-align: center;" rowspan="2" colspan="2">操作按钮</th>
                <th style="width: 200px;text-align: center;" rowspan="2" colspan="2">催办设置</th>
            </tr>
            <tr>
                <th style="width: 60px;text-align: center;">前置</th>
                <th style="width: 60px;text-align: center;">后置</th>
                <th style="width: 60px;text-align: center;">分配</th>
                <th style="width: 60px;text-align: center;">开始<br/>结束</th>
                <th style="width: 60px;text-align: center;"></th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <!--全局设置-->
                <td><span class="iconfont iconminus "></span></td>
                <td>全局设置</td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td><!--催办设置-->
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <!--表单设置-->
                <td>
                    <#if formMap['global'] >
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--表单设置Url-->
                <td class="tabUrl" name="bpmNodeSet">
                    <a class="iconfont iconceshishenqing" style="cursor: pointer"
                       onclick="gotoSetUrl('bpmNodeSet/view/list','modelId=${RequestParameters.modelId!}&&parentProcDefId=${RequestParameters.parentProcDefId!}')"
                    ></a>
                </td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
            </tr>
            <tr>
                <!--开始节点-->
                <td><span class="iconfont iconminus "></span></td>
                <td>开始节点
                    <!--todo 暂时，因为美观所以注释-->
                    <!--<br/>(${startFlowNode.nodeName})-->
                </td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <!--流程事件-开始结束-->
                <td>
                    <#if startScriptMap[startFlowNode.nodeId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--流程事件Url-->
                <td><a class="iconfont iconceshishenqing
                    eventSetWindow" style="cursor: pointer"  itemtype="nodeId=${startFlowNode.nodeId}&&type=StartEvent"
                ></a></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <!--表单设置-->
                <td>
                    <#if formMap[start]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <td><span class="iconfont iconminus "></span></td>
                <!--操作按钮-->
                <td>
                    <#if buttonMap[startFlowNode.nodeId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--操作按钮Url-->
                <td class="tabUrl" name="bpmNodeButton">
                    <a class="iconfont iconceshishenqing" style="cursor: pointer"
                       onclick="gotoBtnSetUrl('bpmNodeButton/view/list','modelId=${RequestParameters.modelId!}&&nodeId=${startFlowNode.nodeId}')"></a>
                </td><!--催办设置-->
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
            </tr>
            <#list endFlowNodeList as ends>
            <tr>
                <!--结束节点-->
                <td><span class="iconfont iconminus "></span></td>
                <td>结束节点
                    <!--<br/>(${ends.nodeName})-->
                </td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <!--流程事件-开始结束-->
                <td>
                    <#if endScriptMap[ends.nodeId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--流程事件Url-->
                <td><a class="iconfont iconceshishenqing
                       eventSetWindow" style="cursor: pointer"  itemtype="nodeId=${ends.nodeId}&&type=EndEvent"
                ></a></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td><!--催办设置-->
                <td><span class="iconfont iconminus "></span></td>
                <td><span class="iconfont iconminus "></span></td>
            </tr>
            </#list>
            <#list nodeSetList as nodes>
            <tr>
                <!--流程节点-->
                <td>${nodes_index+1}</td>
                <td>${nodes.nodeName}
                    <!--</br>(${nodes.nodeId})-->
                </td>
                <!--人员设置-->
                <td>
                    <#if nodeUserMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--人员设置Url-->
                <td class="tabUrl" name ="actDefModel">
                    <!--弹窗格式-->
                    <!--<a class="iconfont iconceshishenqing userSet"></a>-->
                    <!--跳转页面-->
                    <a class="iconfont iconceshishenqing" style="cursor: pointer" onclick="gotoUserUrl()"></a>
                    <!--<a class="iconfont iconceshishenqing" id="gotoUserUrl" style="cursor: pointer" ></a>-->
                </td>
                <!--流程事件-前置-->
                <td>
                    <#if preScriptMap[nodes.setId] >
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--流程事件-后置-->
                <td>
                    <#if  afterScriptMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--流程事件-分配-->
                <td>
                    <#if  assignScriptMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <td><span class="iconfont iconminus "></span></td>
                <!--流程事件Url-->
                <td><a class="iconfont iconceshishenqing
                    eventSetWindow" style="cursor: pointer"  itemtype="nodeId=${nodes.nodeId}&&type=UserTask"
                ></a></td>
                <!--流程规则-->
                <td>
                    <#if  nodeRulesMap[nodes.setId] >
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--流程规则Url-->
                <td><a class="iconfont iconceshishenqing
                       ruleSetWindow" style="cursor: pointer"  itemtype="nodeId=${nodes.nodeId}&&nodeName=${nodes.nodeName}"
                ></a></td>
                <!--表单设置-->
                <td>
                    <#if bpmFormMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--表单设置Url-->
                <td class="tabUrl" name="bpmNodeSet">
                    <a class="iconfont iconceshishenqing" style="cursor: pointer"
                       onclick="gotoSetUrl()"
                    ></a>
                </td>
                <!--'bpmNodeSet/view/list','modelId=${RequestParameters.modelId!}&&parentProcDefId=${RequestParameters.parentProcDefId!}'-->
                <!--操作按钮-->
                <td>
                    <#if nodeButtonMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--操作按钮Url-->
                <td class="tabUrl" name="bpmNodeButton">
                    <a class="iconfont iconceshishenqing " style="cursor: pointer"
                       onclick="gotoBtnSetUrl()"
                    ></a>
                </td>
                <!--催办设置 -->
                <td>
                    <#if taskReminderMap[nodes.setId]>
                        <span class="iconfont iconcheck" style="color:#428000;"></span>
                    <#else>
                        <span class="iconfont iconguanbi " style="color:#ff0000"></span>
                    </#if>
                </td>
                <!--催办设置Url-->
                <td><a class="iconfont iconceshishenqing remindSetWindow" itemtype="nodeId=${nodes.nodeId}" ></a>
                </td>
            </tr>
           </#list>
        </tbody>
        </table>

    </div>


    <script>
         var element = layui.element;
        //表单设置、操作按钮 的 功能设置Url
        function gotoUserUrl() {
            element.tabChange('commonSetting', "userSet");
        }
        function gotoSetUrl() {
            // changeLoad( "/workflow/"+url+'?'+params);
            element.tabChange('commonSetting', "formSet");
        }
        function gotoBtnSetUrl() {
            element.tabChange('commonSetting', "nodeBtnSet");
        }
        layui.use(['setter'], function() {
            var setter = layui.setter;
            // var element = layui.element;
            var $ = layui.$;

            // /**
            //  * TODO layui的切换标签页失败
            //  */
            // $('#gotoUserUrl').click(function () {
            //     element.tabChange('commonSetting', "userSet");
            //     // window.location.href="${ctx}/workflow/actDefModel/view/userSet?modelId=${modelId}";
            //     $(this).attr("href",serverPath.workflowPath + setter.workflowLinkPath + "actDefModel/view/userSet?modelId=${modelId}");
            // });
            // $('#gotoSetUrl').click(function () {
            //     element.tabChange('commonSetting', "formSet");
            //     $(this).attr("href",serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeSet/view/list?modelId=${modelId}");
            // });
            // $('#gotoBtnSetUrl').click(function () {
            //     element.tabChange('commonSetting', "nodeBtnSet");
            //     $(this).attr("href",serverPath.workflowPath + setter.workflowLinkPath + "bpmNodeButton/view/list?modelId=${modelId}");
            // });

            //人员设置弹窗
            // $(document).on('click','.userSet',function () {
            //     var url='#/workflow/actDefModel/view/userSet?modelId=${RequestParameters.modelId!}&&nodeId=${nodes.nodeId}&&parentProcDefId=${RequestParameters.parentProcDefId!}'
            //     layer.open({
            //         type: 2,
            //         title: "任务会签规则设置",
            //         area: ['800px', '700px'],
            //         content:  + url
            //     });
            // })

        // 流程事件脚本 的 功能设置弹窗
        $('.eventSetWindow').click(function () {
            var params = $(this).attr('itemtype');
            var url = 'bpmNodeScript/view/edit?procDefId=${actDefModel.procDefId}&&modelId=${RequestParameters.modelId!}&&parentProcDefId=${RequestParameters.parentProcDefId!}&&' + params;
            layer.open({
                type: 2,
                title: "设置流程事件脚本",
                area: ['800px', '385px'],
                content:serverPath.workflowPath + setter.workflowLinkPath + url,
                success: function($dom, index) {
                    // $("#layui-layer" + index + " .layui-layer-content").append("<div style='padding:20px;'></div>");
                    // $("#layui-layer" + index + " .layui-layer-content div").load(serverPath.workflowPath + setter.workflowLinkPath + url, function() {
                    // })
                },
                end:function () {
                    element.tabChange('commonSetting', "nodeSummary");
                }
            });
        });

        //流程规则 的 功能设置弹窗
        $('.ruleSetWindow').click(function () {
            var params = $(this).attr('itemtype');
            var url = 'bpmNodeRule/view/edit?deployId=${actDefModel.deployId}&&procDefId=${actDefModel.procDefId!}&&parentProcDefId=${RequestParameters.parentProcDefId!}&&'+params;
            layer.open({
                type: 1,
                area: ['1000px', '560px'],
                title: ['流程跳转规则'],
                content:'',
                success: function($dom, index) {
                    $("#layui-layer" + index + " .layui-layer-content").append("<div ></div>");
                    $("#layui-layer" + index + " .layui-layer-content div").load(serverPath.workflowPath + setter.workflowLinkPath +url, function() {
                    })
                },
                end:function () {
                    element.tabChange('commonSetting', "nodeSummary");
                }
            });
        });

        // 催办设置 的 功能设置弹窗
        // TODO 仅仅写了弹窗的架构，其他的都需要参考节点设置-催办的代码再次修改
        $('.remindSetWindow').click(function () {
            var params = $(this).attr('itemtype');
            var url = 'taskReminder/view/add?procDefId=${actDefModel.procDefId}&&parentProcDefId=${parentProcDefId}&&'+params;
            layer.open({
                type: 2,
                area: ['1050px', '560px'],
                title: ['任务催办设置'],
                content: serverPath.workflowPath + setter.workflowLinkPath + url ,
                skin: 'btn-class reminderBtn',
                btn: ['保存','关闭','增加'],
                btnAlign: 'c',
                yes: function(index,layero){
                    //保存
                    var iframeWin = window[layero.find('iframe')[0]['name']];
                    iframeWin.save();
                },
                btn2: function(index, layero){
                    //关闭
                },
                btn3: function(index, layero){
                    //增加
                    var iframeWin = window[layero.find('iframe')[0]['name']];
                    iframeWin.addNew();
                    return false;
                },
                end:function () {
                    element.tabChange('commonSetting', "nodeSummary");
                }
            });
        });
    })
</script>
